<template>
  <div>
    <iframe
      id="iframe"
      width="100%"
      src="https://juejin.cn/"
      frameborder="0"
      @load="changeFrameHeight"
    >
    </iframe>
  </div>
</template>

<script>
import { defineComponent, onMounted } from 'vue';
export default defineComponent({
  name: 'Home',
});
</script>
<script setup>
function changeFrameHeight() {
  let ifm = document.getElementById('iframe');
  ifm.height = document.documentElement.clientHeight - 50;
}

onMounted(() => {
  window.addEventListener('resize', function () {
    changeFrameHeight();
  });
});
</script>

<style lang="scss" scoped>
#ifm {
  width: 100vw;
  height: 500px;
}
</style>
